<template>
  <div>
    <a-toolbar :definition="definition" :showSearch.sync="showSearchComputed" @queryTable="getList"/>
    <my-form ref="myForm" title="新增客户" @getList="getList"/>

    <el-dialog
      top="1vh"
      :close-on-click-modal="false"
      append-to-body
      title="选择用户"
      :visible.sync="dialogVisible"
      width="30%">

      <el-select v-model="queryRequest.userId" placeholder="请选择用户">
        <el-option
          v-for="item in userIdList"
          :key="item.userId"
          :label="item.nickName"
          :value="item.userId">
        </el-option>
      </el-select>

      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="clickSubmit">确 定</el-button>
      </span>

    </el-dialog>

  </div>
</template>

<script>
import MyForm from './form.vue'
import {
  backAfter,
  backLoan,
  claimCustomer,
  distAfter,
  distCustomer,
  distLoan,
  publicLoan,
  selectUserList,
  stateToAfter,
  stateToLoan,
  publicDist
} from "@/api/lion/customerInfo";


export default {
  name: "toobar",
  components: {MyForm},
  props: {
    showSearch: {
      type: Boolean,
      required: true
    },
    type: {
      type: Number,
      required: true
    },
    selectIdList: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      dialogVisible: false,
      userIdList: [],
      callFun: '',
      definition: [
        {
          icon: '',
          name: '添加客户',
          click: () => {
            this.$refs.myForm.open(1)
          }
        },
        {
          icon: '',
          name: '认领',
          if: () => this.type === 1,
          disabled: () => this.selectIdList.length > 0,
          click: () => {
            this.claimCustomer()
          }
        },
        {
          icon: '',
          name: '分配',
          if: () => this.type === 1,
          disabled: () => this.selectIdList.length > 0,
          hasPer: ['allocationCommon'],
          click: () => {
            this.openSelectUserDialog('distCustomer')
          }
        },
        {
          icon: '',
          name: '放到售前公共池',
          if: () => this.type === 5,
          disabled: () => this.selectIdList.length > 0,
          click: () => {
            this.publicDist()
          }
        },
        {
          icon: '',
          name: '分配',
          if: () => this.type === 5,
          disabled: () => this.selectIdList.length > 0,
          click: () => {
            this.openSelectUserDialog('distCustomer')
            // this.distCustomer()
          }
        },
        // {
        //   icon: '',
        //   name: '放到后期公共池',
        //   if: () => this.type === 6,
        //   disabled: () => this.selectIdList.length > 0,
        //   click: () => {
        //     this.publicLoan()
        //   }
        // },
        {
          icon: '',
          name: '重新分配',
          if: () => this.type === 6,
          disabled: () => this.selectIdList.length > 0,
          click: () => {
            this.openSelectUserDialog('distLoan')
            // this.distLoan()
          }
        },
        // {
        //   icon: '',
        //   name: '放到售后公共池',
        //   if: () => this.type === 7,
        //   disabled: () => this.selectIdList.length > 0,
        //   click: () => {
        //     this.publicAfter()
        //   }
        // },
        {
          icon: '',
          name: '重新分配',
          if: () => this.type === 7,
          disabled: () => this.selectIdList.length > 0,
          click: () => {
            this.openSelectUserDialog('distAfter')
            // this.distAfter()
          }
        },
        {
          icon: '',
          name: '分配后期',
          if: () => this.type === 8,
          disabled: () => this.selectIdList.length > 0,
          click: () => {
            this.openSelectUserDialog('distLoan')
            // this.distLoan()
          }
        },
        {
          icon: '',
          name: '分配售后',
          if: () => this.type === 9,
          disabled: () => this.selectIdList.length > 0,
          click: () => {
            this.openSelectUserDialog('distAfter')
            // this.distAfter()
          }
        }
      ],
      queryRequest: {userId: undefined, ids:[]}
    }
  },
  computed: {
    showSearchComputed: {
      get() {
        return this.showSearch
      },
      set(value) {
        this.$emit('update:showSearch', value)
      }
    }
  },
  methods: {
    getList() {
      this.$emit('getList')
    },
    resetQuery() {
      this.queryRequest.userId = undefined
      this.queryRequest.ids = []
    },
    //领取客户
    claimCustomer() {
      this.queryRequest.ids = this.selectIdList
      claimCustomer(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //分配客户
    distCustomer() {
      console.log(111)
      this.queryRequest.ids = this.selectIdList
      distCustomer(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //转售前公共池
    publicDist() {
      this.queryRequest.ids = this.selectIdList
      publicDist(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //客户转后期
    stateToLoan() {
      this.queryRequest.ids = this.selectIdList
      stateToLoan(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //分配后期
    distLoan() {
      this.queryRequest.ids = this.selectIdList
      distLoan(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //后期打回
    backLoan() {
      this.queryRequest.ids = this.selectIdList
      backLoan(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //后期转公共池
    publicLoan() {
      this.queryRequest.ids = this.selectIdList
      publicLoan(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //客户转售后
    stateToAfter() {
      this.queryRequest.ids = this.selectIdList
      stateToAfter(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //分配售后
    distAfter() {
      this.queryRequest.ids = this.selectIdList
      distAfter(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //售后打回
    backAfter() {
      this.queryRequest.ids = this.selectIdList
      backAfter(this.queryRequest).then(res => {
        this.getList()
      })
    },
    //转售后公共池
    publicAfter() {
      this.queryRequest.ids = this.selectIdList
      publicAfter(this.queryRequest).then(res => {
        this.getList()
      })
    },

    /**
     * 打开用户选择页面
     */
    openSelectUserDialog(callFun) {
      this.callFun = callFun
      this.dialogVisible = true
      this.getUserList()
    },

    /**
     * 查询用户列表
     */
    getUserList() {
      selectUserList(this.type).then(response => {
        this.userIdList = response.data
      })
    },

    /**
     * 点击提交按钮
     */
    clickSubmit() {
      this.dialogVisible = false
      this[this.callFun]()
    }

  }
}
</script>

<style scoped>

</style>
